<!--

This sample illustrates how to call requestCreateActivity with a truly
modal notification, that is, placing a <div> over the application to make it
'grayed out' so that the user notices the notification

-->
<style type='text/css'>
div#myinterface {
   position: absolute; 
   width: 700px; 
   height: 400px;
   border: 1px solid green;
   text-align: center;
   background: #f0fff0;
}

div#shadow {
   position: absolute;
   width: 700px;
   height: 400px;
   background: #000000;
   filter: alpha(opacity=50);
   opacity: .5;
   visibility: hidden;
}

p.fatpadding {
   padding: 6em 1em;
}
</style>

<div id='myinterface'>
   <p class='fatpadding'>Hello there. This is my sample interface.</p>
   <div><button id='postbutton'>Post an Activity</button></div>
</div>

<div id='shadow'></div>

<script type='text/javascript'>

function init() {
   document.getElementById('postbutton').addEventListener('click',
       onButtonClicked, false);
}

function onButtonClicked() {
   var params = {};
   params[opensocial.Activity.Field.TITLE] = 'This is the <b>activity title</b>.';
   params[opensocial.Activity.Field.BODY] = 'This is the <em>activity body.</em>';

   document.getElementById('shadow').style.visibility = 'visible';

   opensocial.requestCreateActivity(opensocial.newActivity(params),
        opensocial.CreateActivityPriority.HIGH, callback);
}

function callback(data) {
   debug.say(data.hadError() ? 
      '*** Error: ' + data.getErrorMessage() : 'Success.');
   document.getElementById('shadow').style.visibility = 'hidden';
}

gadgets.util.registerOnLoadHandler(init);
</script>
